<template>
	<view class="public-footer">
		<view class="nav padd_32 clearfix" v-if="!staff">
			<view class="fl" v-if="!shop" @click="callphone(nat.enterpriseNameAndPhone.contacts_phone)">
				<image src="/static/images/bottom_button_phone@2x.png" mode="widthFix"></image>
				<view>联系电话</view>
			</view>
			<view class="fl" v-if="shop" @click="callphone(nat.shopInfo.contactsPhone)">
				<image src="/static/images/bottom_button_phone@2x.png" mode="widthFix"></image>
				<view>联系电话</view>
			</view>
			<view class="fr" v-if="shop&&!nat.focused" @click="follow('en', nat.shopInfo.id)">关注</view>
			<view class="fr" v-if="shop&&nat.focused" @click="clear('en', nat.shopInfo.id)">取消关注</view>
			<view @click="toMeal()" class="fr" v-if="meal&&nat.stock>0">去下单</view>
			<view class="fr no" v-if="meal&&nat.stock<=0">暂无套餐</view>
		</view>
		<view class="nav staff-nav padd_32 clearfix" v-if="staff">
			<view v-if="nat.emp&&nat.emp.focused" class="fl" @click="clear('em', nat.emp.id)">
				<image src="/static/images/follow.png" mode="widthFix"></image>
				<view>取消关注</view>
			</view>
			<view v-else class="fl" @click="follow('em', nat.emp.id)">
				<image src="/static/images/follow.png" mode="widthFix"></image>
				<view>关注家政师</view>
			</view>
			<view class="fl" @click="callphone(nat.emp.phone)">
				<image src="/static/images/bottom_button_phone@2x.png" mode="widthFix"></image>
				<view>联系电话</view>
			</view>
			<view @click="toStaff()" class="fr">去下单</view>
		</view>
	</view>
</template>

<script>
import { mapState, mapMutations } from 'vuex';
export default {
	props: {
		shop: false,
		meal: false,
		staff: false,
		nat: '',
		id: ''
	},
	computed: mapState(['hasLogin', 'uerInfo']),
	methods: {
		toMeal() {
			let query = {
				name: this.nat.name,
				id: this.nat.id,
				price: this.nat.price
			}
			uni.navigateTo({
			    url: '/pageageA/pages/order/details-meal?query=' + JSON.stringify(query)
			})
		},
		toStaff() {
			let table = []
			for (let i = 0; i < this.nat.employeeBusinessMaps.length; i++) {
				table.push({
					businessName: this.nat.employeeBusinessMaps[i].businessName,
					businessId: this.nat.employeeBusinessMaps[i].businessId,
					univalence: this.nat.employeeBusinessMaps[i].univalence,
					univalenceUnit: this.nat.employeeBusinessMaps[i].univalenceUnit,
					description: this.nat.employeeBusinessMaps[i].business.description,
					minPrice: this.nat.employeeBusinessMaps[i].business.minPrice,
					maxPrice: this.nat.employeeBusinessMaps[i].business.maxPrice,
					minCount: this.nat.employeeBusinessMaps[i].business.minCount,
				})
			}
			let query = {
				emp: this.nat.emp,
				employeeBusinessMaps: table,
			}
			uni.navigateTo({
			    url: '/pageageA/pages/order/details-staff?id=' + this.id + '&query=' + JSON.stringify(query)
			})
		},
		follow(e, id) {
			var _this = this;
			_this.$http
				.post('/personal/center/addfavorite', {
					userid: this.uerInfo.userId,
					type: e,
					id: id
				})
				.then(function(response) {
						uni.showToast({
						    title: '关注成功',
						    duration: 1000,
							icon: 'none'
						})
					if (e == 'en') {
						_this.$parent.childByValue(!_this.nat.focused)
					} else {
						_this.$parent.childByValue(!_this.nat.emp.focused)
					}
				})
				.catch(function(error) {
					console.log(error);
				});
		},
		clear(e, id) {
			var _this = this
			let url = '/personal/center/cancelfavorite/' + e + '/' + _this.uerInfo.userId + '/' + id
			_this.$http
				.get(url)
				.then(function(response) {
					uni.showToast({
					    title: '取消关注成功',
					    duration: 1000,
						icon: 'none'
					})
					if (e == 'en') {
						_this.$parent.childByValue(!_this.nat.focused)
					} else {
						_this.$parent.childByValue(!_this.nat.emp.focused)
					}
				})
				.catch(function(error) {
					console.log(error);
				});
		},
		callphone(phone) {
			var _this = this
			console.log(phone)
			uni.makePhoneCall({
			    phoneNumber: phone //仅为示例
			});
		}
	}
};
</script>

<style scoped lang="scss">
.nav {
	width: 100%;
	position: fixed;
	padding: 20rpx 32rpx;
	bottom: 0;
	background-color: #fff;
}
.nav .fl {
	color: #333;
	font-size: 26rpx;
}
.nav .fl image {
	width: 48rpx;
	margin-bottom: 16rpx;
	margin-left: 28rpx;
}
.nav .fr {
	background-color: $uni-color1;
	box-shadow: 0px 6px 20px 0px $uni-color1;
	border-radius: 10rpx;
	width: 538rpx;
	height: 100rpx;
	line-height: 100rpx;
	color: #fff;
	font-size: 36rpx;
	text-align: center;
}
.no{
	background: #E3E3E3 !important;
	box-shadow: 0px 6px 20px 0px #E3E3E3 !important;
}
.staff-nav .fr {
	width: 350rpx;
}
.staff-nav .fl {
	margin-right: 40rpx;
}
.staff-nav .fl:first-child image {
	margin-left: 40rpx;
}
</style>
